<!--  -->
<template>
  <div>
    <!-- 搜索条件 -->
    <search-header></search-header>
    <query-table @showDia="showDia"></query-table>
    <el-dialog :visible.sync="dialogShow" fullscreen top="30px">
      <h3 class="title">Records Views</h3>
      <div class="line"></div>
      <div class="content">
        <span>
          <font style="font-weight:900">Record Time :</font> 2016-05-04
        </span>
      </div>
      <div class="content">
        <span>
          <font style="font-weight:900">User :</font> admin
        </span>
      </div>
      <div class="content">
        <span>
          <font style="font-weight:900">Id :</font> bdsks1111
        </span>
      </div>
      <div class="content">
        <span>
          <font style="font-weight:900">Detail :</font> 
            import queryTable from "@/views/visualized/components/queryTable";
        </span>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import searchHeader from "@/views/visualized/components/searchHeader";
import queryTable from "@/views/visualized/components/queryTable";
export default {
  name: "",
  props: [""],
  data() {
    return {
      dialogShow: false
    };
  },
  components: {
    searchHeader,
    queryTable
  },
  computed: {},
  beforeMount() {},
  mounted() {},
  methods: {
    showDia(e) {
      console.log(e);
      this.dialogShow = true;
    }
  },
  watch: {}
};
</script>

<style  scoped>
.title {
  position: absolute;
  top: 10px;
  left: 40px;
  width: 95%;
}
.el-dialog__body {
  height: 50vh;
  overflow: auto;
}

font {
  width: 100px;
}
.content {
  margin: 20px;
  font-size: 20px;
}
.line {
  width: 98%;
  height: 1px;
  background-color: black;
  margin-left: 20px;
}
.customerDialog {
  height: 90%;
}
</style>